<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="style.css" />
    <style>
      /* body{
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100vh;
      width:100vw;
      overflow: hidden;
    } */
      svg {
        border: 2px solid black;
      }
    </style>
  </head>

  <body>
    <svg width="1350" height="794" viewBox="0 0 1350 794" fill="none" xmlns="http://www.w3.org/2000/svg">
      <path id="path2" d="M299 496C352.295 398.008 499.047 235.222 659.698 368.011C820.349 500.8 999.504 403.342 1069 338.014" stroke="black" stroke-width="4" />

      <g id="plane" transform="translate(-100,-100)">
        <path
          d="M121.843 55.8867C121.843 53.8594 120.202 52.2188 118.175 52.2188L114.038 52.2188C112.015 52.2188 110.374 53.8594 110.374 55.8867C110.374 57.9102 112.015 59.5508 114.038 59.5508L118.175 59.5508C120.202 59.5508 121.843 57.9121 121.843 55.8867ZM110.884 33.8926C110.884 31.8691 109.243 30.2285 107.22 30.2285L102.884 30.2285C100.86 30.2285 99.2197 31.8691 99.2197 33.8926C99.2197 35.9199 100.86 37.5605 102.884 37.5605L107.22 37.5605C109.245 37.5605 110.884 35.9199 110.884 33.8926ZM121.843 143.852C121.843 141.824 120.202 140.184 118.175 140.184L114.038 140.184C112.015 140.184 110.374 141.824 110.374 143.852C110.374 145.875 112.015 147.516 114.038 147.516L118.175 147.516C120.202 147.516 121.843 145.877 121.843 143.852ZM110.884 165.844C110.884 163.816 109.243 162.176 107.22 162.176L102.884 162.176C100.86 162.176 99.2197 163.816 99.2197 165.844C99.2197 167.867 100.86 169.508 102.884 169.508L107.22 169.508C109.245 169.508 110.884 167.867 110.884 165.844Z"
          fill="#CCD1D9"
        />
        <path
          d="M71.5962 15.5703C71.5973 14.5978 71.984 13.6655 72.6717 12.9778C73.3593 12.2902 74.2917 11.9034 75.2642 11.9023L89.9243 11.9023C91.3052 11.9023 92.5689 12.6816 93.1939 13.9102L128.516 83.5508C129.432 85.3555 128.711 87.5605 126.907 88.4766C125.102 89.3926 122.897 88.6699 121.981 86.8672L93.5142 85.3398C93.9243 87.3203 92.6529 89.2617 90.6704 89.6758C88.69 90.0859 86.7486 88.8144 86.3345 86.832L71.6743 16.3145C71.6236 16.0684 71.5962 15.8164 71.5962 15.5703ZM71.5962 184.168C71.5962 183.922 71.6236 183.672 71.6743 183.422L86.3345 112.906C86.7486 110.926 88.688 109.652 90.6704 110.062C92.6509 110.477 93.9243 112.416 93.5142 114.398L121.981 112.871C122.897 111.066 125.102 110.346 126.907 111.262C128.713 112.178 129.432 114.383 128.516 116.191L93.1939 185.83C92.5689 187.062 91.3052 187.838 89.9243 187.838L75.2642 187.838C74.1607 187.838 73.1177 187.342 72.4204 186.484C71.8883 185.83 71.5973 185.012 71.5962 184.168Z"
          fill="#E6E9ED"
        />
        <path
          d="M60.2124 89.498C60.8159 88.293 60.7143 86.8535 59.9409 85.75L45.2807 64.7812C44.9425 64.2984 44.4929 63.9041 43.97 63.6318C43.4472 63.3595 42.8664 63.2171 42.2768 63.2168L27.6147 63.2168C26.4331 63.2168 25.3257 63.7852 24.6382 64.7461C24.2984 65.2192 24.0764 65.7665 23.9905 66.3426C23.9045 66.9187 23.9572 67.5069 24.144 68.0586L31.4761 89.668C31.728 90.4106 32.2116 91.0529 32.8556 91.5005C33.4996 91.948 34.2702 92.1772 35.0542 92.1543L57.0444 91.5137C58.3901 91.4746 59.6089 90.6992 60.2124 89.498ZM45.2807 134.955L59.9409 113.986C60.3199 113.444 60.5452 112.809 60.5929 112.15C60.6407 111.49 60.5092 110.829 60.2124 110.238C59.9157 109.647 59.4644 109.148 58.9066 108.793C58.3488 108.438 57.7053 108.241 57.0444 108.223L35.0542 107.58C33.4448 107.531 31.9936 108.541 31.4761 110.066L24.144 131.676C24.0151 132.061 23.9507 132.457 23.9507 132.852C23.9507 133.609 24.185 134.357 24.6382 134.988C25.3257 135.949 26.435 136.518 27.6147 136.518L42.2768 136.518C43.4721 136.521 44.5952 135.936 45.2807 134.955Z"
          fill="#4A89DC"
        />
        <path
          d="M23.9502 110.695L23.9502 88.7051C23.9502 86.7246 25.5225 85.1035 27.5049 85.043C32.4463 84.8926 148.597 81.375 155.897 81.375C160.483 81.375 166.577 83.1113 171.421 85.8027C177.954 89.4316 181.552 94.3691 181.552 99.6992C181.552 105.033 177.954 109.971 171.421 113.598C166.575 116.287 160.481 118.027 155.897 118.027C148.597 118.027 32.4463 114.512 27.5049 114.359C25.5225 114.301 23.9502 112.678 23.9502 110.695Z"
          fill="#5D9CEC"
        />
        <path
          d="M157.194 110.461C157.618 110.3 159.114 109.644 160.536 107.957C161.763 106.496 163.229 103.879 163.229 99.7009C163.229 93.0075 159.437 89.7907 157.194 88.9411C155.3 88.2262 153.185 89.1833 152.47 91.0759C152.31 91.5016 152.231 91.9391 152.231 92.3688C152.231 93.7966 153.071 95.1442 154.448 95.738C154.673 95.8669 155.897 96.7067 155.897 99.7009C155.897 102.697 154.673 103.537 154.448 103.666C152.657 104.437 151.774 106.488 152.47 108.33C153.187 110.22 155.302 111.175 157.194 110.461Z"
          fill="#F5F7FA"
        />
        <path
          d="M20.2861 99.7012C20.2861 97.6777 21.9268 96.0371 23.9502 96.0371L49.6064 96.0371C51.6299 96.0371 53.2744 97.6777 53.2744 99.7012C53.2744 101.725 51.6318 103.369 49.6064 103.369L23.9502 103.369C21.9268 103.367 20.2861 101.725 20.2861 99.7012Z"
          fill="#4A89DC"
        />
      </g>
      <!-- keyPoints  -->
      <animateMotion href="#plane" dur="2s" repeatCount="indefinite" rotate="auto" keyPoints="0;0.2;1" keyTimes="0;0.5;1">
        <mpath href="#path2" />
      </animateMotion>
    </svg>
  </body>
</html>
